<!DOCTYPE HTML>
<html>
	<head>
	<meta charset="utf-8">
		<title>LDU-SmartHouse</title>
		<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
		<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
		<script src="js/jquery.min.js"></script>
		 <!-- Custom Theme files -->
		<link href="css/style.css" rel='stylesheet' type='text/css' />
   		 <!-- Custom Theme files -->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
		</script>
		 <!---- start-smoth-scrolling---->
		<script type="text/javascript" src="js/move-top.js"></script>
		<script type="text/javascript" src="js/easing.js"></script>
		<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
				});
			});
		</script>
		 <!---- start-smoth-scrolling---->
		<!----start-top-nav-script---->
		<script>
			$(function() {
				var pull 		= $('#pull');
					menu 		= $('nav ul');
					menuHeight	= menu.height();
				$(pull).on('click', function(e) {
					e.preventDefault();
					menu.slideToggle();
				});
				$(window).resize(function(){
	        		var w = $(window).width();
	        		if(w > 320 && menu.is(':hidden')) {
	        			menu.removeAttr('style');
	        		}
	    		});
			});
		</script>
		
		<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
		<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script>
		<script type="text/javascript" src="js/showdata.js"></script>
		
		<!----//End-top-nav-script---->
	</head>
	<body>
		<div class="main-header">
		<!----- start-header---->
			<div id="home" class="header">
					<div class="top-header">
						<div class="container">
						<div class="logo">
							   <img src="images/logo.png" alt="">
						</div>
						<!----start-top-nav---->
						 <nav class="top-nav">
							<ul class="top-nav">
								<li class="active"><a href="#home" class="scroll">Home </a></li>
								<li><a href="#about" class="scroll">关于</a></li>
								<li><a href="#services" class="scroll">服务</a></li>
								<li><a href="#portfolio" class="scroll">产品展示</a></li>
								<li><a href="#team" class="scroll">团队</a></li>
								<li><a href="#contact" class="scroll">联系我们</a></li>
							</ul>
							<a href="#" id="pull"><img src="images/menu-icon.png" title="menu" /></a>
						</nav>
						<div class="clearfix"> </div>
					</div>
				</div>
			</div>
		<!----- //End-header---->
		<!----start-slider-script---->
			<script src="js/responsiveslides.min.js"></script>
			 <script>
			    // You can also use "$(window).load(function() {"
			    $(function () {
			      // Slideshow 4
			      $("#slider4").responsiveSlides({
			        auto: true,
			        pager: true,
			        nav: true,
			        speed: 500,
			        namespace: "callbacks",
			        before: function () {
			          $('.events').append("<li>before event fired.</li>");
			        },
			        after: function () {
			          $('.events').append("<li>after event fired.</li>");
			        }
			      });
			
			    });
			  </script>
			<!----//End-slider-script---->
			<!-- Slideshow 4 -->
			    <div  id="top" class="callbacks_container">
			      <ul class="rslides" id="slider4">
			        <li>
			        	<div class="tittle-head">
			        		<h1>SmartHouse</h1>
			          		<p>Just for you. </p>
			          		<div class="learn-button">
			          			<a class="slide-btn" href="#" target="_blank" rel="nofollow">在线查看Demo</a>
			          		</div>
			          	</div>
			        </li>
			        <li>
			        <div class="tittle-head">
			        		<h1>实时监控</h1>
			          		<p>Just for you. </p>
			          		<div class="learn-button">
			          			<a class="slide-btn" href="#" target="_blank" rel="nofollow">在线查看Demo</a>
			          		</div>
			          	</div>
			        </li>
			        <li>
			         <div class="tittle-head">
			        		<h1>实时控制</h1>
			          		<p>Just for you. </p>
			          		<div class="learn-button">
			          			<a class="slide-btn" href="#" target="_blank" rel="nofollow">在线查看Demo</a>
			          		</div>
			          	</div>
			        </li>
			      </ul>
			    </div> 
			    <div class="clearfix"> </div>
			    </div>
			<!----- //End-slider---->
			<div id="about" class="about">
				<div class="container">
					<div class="about-head">
						<h3>关于我们</h3>
						<span>我们是谁?</span>
						<p>我们是来自鲁东大学2012级软件工程课程项目——SmartHouse项目小组. 小组基于课程安排，自由组织而来。
						小组以SmartHouse为主概念，探索实现一些相关功能。没错，we know nothing at all about what we will do
						</p>
					</div>
				</div>
				
			</div>
			<!----- //End-about---->
			<div id="services" class="services">
       		<div class="container">
       		   <div class="gallery-head text-center">
				  <h3>服务</h3>
				  <p>全方位服务!.</p>
			    </div>
       			<div class="row text-center feature">
       				<div class="col-md-4 service_grid">
       					<i class="icon1"> </i>
       					<h3>微信公众号</h3>
       					<p>关注SmartHouse微信公众号,实时查看当前室内环境状态，并提供每日娱乐.</p>
       				</div>
       				<div class="col-md-4 service_grid">
       				<i class="icon2"> </i>
       					<h3>PC 网页</h3>
       					<p>通过PC浏览器实时查看当前室内环境状态.动态图表，一目了然！</p>
       				</div>
       				<div class="col-md-4 service_grid">
       					<i class="icon3"> </i>
       					<h3>安卓 Apps</h3>
       					<p>实时查看当前室内状态，并可通过手机对一系列家用电器（现阶段硬件实验模块实现）进行远程控制.专业的UI设计,完美的用户体验.</p>
       				</div>
       			</div>
       		</div>
       	</div>
	 <!---//End-services----->
	 <div class="portfolio">
	 	<div class="container">
	 		<div class="potrfolio-head" id="showdata">
		 		<h2>体验微信服务!</h2>
				 <a class="prt-btn" href="#">关注SmartHouse微信公众号!</a>
			 </div>
		</div>
	</div>
 	<div id="portfolio" class="potrfolio-content">
 		<div class="container">
 			<div class="port-head">
 				<h3>产品展现</h3>
 				<p>产品全系列展现</p>
 			</div>
			 	<div id="portfoliolist">
					<div class="portfolio-grids">
						<div class="portfolio-wrapper">		
							<div class="view second-effect">
								<img src="images/p-1.png" />
								  <div class="mask">
										<a href="#" class="info">Read More</a>
								  </div>
							</div>
						</div>
					</div>	
					<div class="portfolio-grids">
						<div class="portfolio-wrapper">		
							<div class="view second-effect">
								<img src="images/p-2.png" />
									 <div class="mask">
										<a href="#" class="info">Read More</a>
									 </div>
							</div>
						</div>
					</div>	
					<div class="portfolio-grids">
						<div class="portfolio-wrapper">		
							<div class="view second-effect">
								<img src="images/p-3.png" />
								  <div class="mask">
									 <a href="#" class="info">Read More</a>
								 </div>
							</div>
						</div>
					</div>	
					<div class="portfolio-grids">
						<div class="portfolio-wrapper">		
							<div class="view second-effect">
							 <img src="images/p-4.png" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
						</div>
					</div>
					<div class="portfolio-grids">
						<div class="portfolio-wrapper">		
							<div class="view second-effect">
								<img src="images/p-5.png" />
								 <div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
						</div>
					</div>	
				</div>
			 </div>
	 	 </div>
	 	  <!---//End-portfolio----->
	 	    <!---//End-portfolio----->
	 	 <div id="team" class="team">
	 	 	<div class="container">
	 	 		<div class="team-head">
	 	 			<h3>团队成员</h3>
 					<p>这就是我们!</p>
	 	 		</div>
       			<div class="row text-center teams">
       				<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-1.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>赵恒晨</h3>
       					<p>项目组长,负责硬件及安卓App开发</p>
       				</div>
					<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-2.png" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>王新勇</h3>
       					<p>项目副组长,负责服务器端开发部署</p>
       				</div>
					<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-3.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>马莎</h3>
       					<p>App组成员,负责安卓App设计及开发.</p>
       				</div>
					<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-4.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>钟毓灵</h3>
       					<p>服务端成员,负责服务端数据库模式设计.</p>
       				</div>
					<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-5.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>唐小新</h3>
       					<p>硬件端成员,负责开发板程序开发.</p>
       				</div>
       				<div class="col-md-4 team_grid">
       				<div class="view2 second-effect2">
							 <img src="images/tm-6.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>吴珊珊</h3>
       					<p>服务器端成员,负责项目主页设计与实现.</p>
       				</div>
       				<div class="col-md-4 team_grid">
       					<div class="view2 second-effect2">
							 <img src="images/tm-7.jpg" />
								<div class="mask">
									<a href="#" class="info">Read More</a>
								</div>
							</div>
       					<h3>闫慧慧</h3>
       					<p>服务器端成员,负责项目主页设计与实现.</p>
       				</div>
       			</div>
       		</div>
	 	 </div>
	 	 <!---//End-team----->
	 	  <div class="contact">
	 	  	<div class="container">
	 		<div class="contact-head">
		 		<h3>详细了解产品动态!</h3>
				 <a class="con-btn" href="#">关注我们的微博!</a>
			 </div>
			</div>
	 	  </div>
	 	   <div id="contact" class="feedback">
	 	   		<div class="container">
	 	   			<div class="feed-head">
	 	 			<h3>联系我们 </h3>
 					<p>Get in touch!</p>
	 	 		</div>
	 	 		<div class="feed-contact">
				 	 			<div class="col-md-8 contact-form">
											<form>
												<input type="text" class="textbox" value="姓名" onfocus="this.value = '';" onblur="if (this.value == '姓名') {this.value = '姓名';}">
												<input type="text" class="textbox" value="E-mail" onfocus="this.value = '';" onblur="if (this.value =='E-mail') {this.value = 'E-mail';}">
												<textarea value="Message" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '填写消息内容';}">填写消息内容</textarea>
												<input type="submit" value="Send a message" >

											</form>
								</div>
								<div class="col-md-4 address">
										<h4>Our Team </h4>
										<p>山东·烟台·鲁东大学</p>
										<p>信息与电气工程学院·逸夫实验楼·603·嵌入式实验室.</p><br>
										<p>+1555 2206 xxx</p>
										<p><a href="#" >LDU123#163.com</a></p>
									<div class="footer-icons">
										<ul class="soc_icons unstyled-list list-inline">
											<li><a href="#"><i class="icon_1"></i></a></li>
											<li><a href="#"><i class="icon_2"></i></a></li>
											<li><a href="#"><i class="icon_3"></i></a></li>
											<li><a href="#"><i class="icon_4"></i></a></li>
											<div class="clearfix"> </div>
										</ul>
									</div>
								</div>
								<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="footer">
						<div class="container">
							<div class="logo2">
								   <img src="images/logo2.png" alt="">
							</div>
							<div class="copy-right">
								<p>Copyright &copy; 2015.LDU-SmartHouse All rights reserved.<a target="_blank" href="http://git.oschina.net/ldu/project">Git.OsChina.net地址</a></p>
							</div>								
							<div class="clearfix"> </div>
						</div>	
				</div>	

				<script type="text/javascript">
									$(document).ready(function() {
										/*
										var defaults = {
								  			containerID: 'toTop', // fading element id
											containerHoverID: 'toTopHover', // fading element hover id
											scrollSpeed: 1200,
											easingType: 'linear' 
								 		};
										*/
										
										$().UItoTop({ easingType: 'easeOutQuart' });
										
									});
								</script>
					<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>

</body>
</html>